<template>
    <drag-modal v-model="form.show" v-bind="modelAttrs" @cancel="cancel" @ok="ok">
        <slot name="before"></slot>
        <ag-form :data="form.data" :columns="form.columns" :config="form.config">
            <slot slot="rules">
                <a-row :gutter="24">
                    <a-col :span="22" :push="1">
                        <label for="" class="code-rules">编码规则：
                            <span class="code-text">{{ ruleCode }}</span>
                        </label>
                    </a-col>
                </a-row>
            </slot>
        </ag-form>
        <slot name="after">

        </slot>
        <template slot="footer">
            <div>
                <a-button type="primary" @click="ok">确认</a-button>
                <a-button @click="cancel" class="margin-left-10">关闭</a-button>
            </div>
        </template>

    </drag-modal>
</template>
 
<script>
const customKey = ["show", "data", "config", "columns", "ok"];
import { getAction, postAction } from "@/api/manage";
export default {
    name: "AgModalForm",
    components: {
        AgForm: () => import("@/components/AgForm/AgForm.vue")
    },
    props: {
        form: {
            type: Object,
            default: () => new Object()
        },
        ruleCode: {
            type: String,
            default: ""
        }
    },
    data() {
        return {};
    },
    computed: {
        modelAttrs() {
            const attrs = {
                title: "新增",
                width: 800,
                keyboard: false,
                maskClosable: false
            };
            for (const key in this.form) {
                let a = !customKey.includes(key);
                if (a) attrs[key] = this.form[key];
            }
            return attrs;
        }
    },
    created() {
        if (this.form.config == undefined) {
            this.form.config = {};
        }
    },
    methods: {
        ok() {
            console.log(this.form);
            postAction(this.form.url, this.form.data).then(res => {
                console.log(res);
                if (res.code == 200) {
                    this.$message.success("保存成功");
                    this.form.show = false;
                    this.$emit("ok");
                } else {
                    // // this.$message.warning(res.message);
                }
            });
        },
        cancel() {
            this.form.config.resetFields();
            this.form.show = false;
        }
    }
};
</script>
 
<style lang="scss" >
.code-rules {
    display: inline-block;
    margin-left: 13px;
    padding-bottom: 15px;
    // font-weight: normal !important;
}
.code-text {
    color: red;
    font-family: SimSun, sans-serif;
    font-weight: normal !important;
}
</style>